<template>
	<my-page ref="mypage" v-model="formList" :height="height" @load-data="loadData">
		<template slot="content">
			<view v-for="(item,index) in formList" :key="item.id" class="bg-white mt-4 px-4 pt-4 rounded mx-4 z-10 last:mb-4 active:bg-gray-50" @click="openDetail(item)">
				<view class="flex items-center justify-between">
					<view class="flex items-center text-current ">
						<i class="iconfont icon-paishua"></i>
						<view class="pl-2 text-sm text-black-32 font-bold" v-text="item.typeName"></view>
					</view>
					<view class="pt-1 text-sm">{{item.createTime? $dayjs(item.createTime).format('YYYY-MM-DD HH:mm'):''}}</view>
				</view>
				<view class="pt-3 text-black-32 font-bold">{{item.name}}</view>
				
				<view class=" text-sm flex">
					<view class="flex-1">
						<!-- 由 <text class="font-bold">{{item.createUsername}}</text> 创建 -->
					</view>
					<view>
					<!-- 表单状态 draft 草稿,approve 审批中,complete 完成,pass 通过,notPass 不通过 -->
						<text v-if="item.status == 'draft'" class="text-indigo-600">草稿</text>
						<text v-else-if="item.status == 'approve'" class="text-yellow-500">审批中</text>
						<text v-else-if="item.status == 'complete'" class="text-blue-500">完成</text>
						<text v-else-if="item.status == 'pass'" class="text-blue-500">通过</text>
						<text v-else-if="item.status == 'notPass'" class="text-red-600">不通过</text>
					</view>
				</view>

				<view class="border-gray-100 border-t mt-3 px-2  relative text-center text-sm">
					<view class="text-blue-500 py-3">点击查看表单</view>
					<view v-if="item.status=='draft'" @click.stop.prevent="deleteDraft(item, index)" class="h-full z-50 text-red-500 px-4 py-3 absolute top-0 right-0">删除</view>
				</view>
			</view>
		</template>
	</my-page>
</template>
<script>
import MyPage from '@/components/my_page.vue'
import {getMyFormHistoryList, delLogmaster} from '@/interface/junchuang/form'
export default {
    components: { MyPage },
    props:{
        formCode: String,
		height: {
			type: Number,
			default: 0
		}
    },
    data(){
        return {
            params: {status: '', formCode: this.formCode}
        }
    },
    methods:{
        loadData(page, success, error){
            Object.assign(this.params, page);
            getMyFormHistoryList(this.params).then(res=>{
                if (res.success) {
                    success(res);
                    return;
                }
                error(err);
            }).catch(err=>{
                error(err);
            });
        },
        openDetail(item){
            this.$util.myNavigateTo('/form/detail?formId='+item.formId+'&businessId='+item.id+'&formCode='+item.formCode);
        },
        html2Text(htmlTxt){
            if (this.$utils.isBlank(htmlTxt)) return "";
            var reg = new RegExp("<.+?>","g");//匹配html标签的正则表达式，"g"是搜索匹配多个符合的内容
            var text = htmlTxt.replace(reg, "");//执行替换成空字符
            return text;
        },
        deleteDraft(item, index){
			const v = this
			v.$util.showModal('删除提示', '即将删除 "'+item.name+'" 表单, 是否继续?', true, '确定', '取消', (res) => {
				delLogmaster(item.id).then(res=>{
					const {success, message} = res
				    if (success){
				        v.$u.toast.success(message)
				        v.formList.splice(index, 1)
				    }else {
						v.$u.toast.error(message)
					}
				})
			}, (res) => {
				return
			})
        }
    }
}
</script>